<script lang="ts" setup>
import { defineProps, ref } from 'vue';
import config from '../../../../config/index'

const props = defineProps<{
  wxUserList: WxUser[],
  loading: boolean
}>()
const baseUrl = ref(config.baseUrl)

</script>

<template>
  <el-table
      border
      stripe
      v-model:data="props.wxUserList"
      table-layout="auto"
      v-loading="loading"
      style="width: 100%"
      height="500px">
    <el-table-column
        :show-overflow-tooltip="true"
        prop="nickName"
        label="微信昵称"
        width="150"
        align="center"
    />
    <el-table-column
        prop="phone"
        label="手机号码"
        align="center"
    />
    <el-table-column
        label="头像"
        width="120"
        align="center"
    >
      <template #default="scope">
        <el-avatar :src="baseUrl + '/' + scope.row.avatar" />
      </template>
    </el-table-column>
    <el-table-column
        label="是否会员"
        width="120"
        align="center"
    >
      <template #default="scope">
        <el-tag v-if="scope.row.isVip" type="warning">会员</el-tag>
        <el-tag v-else>普通用户</el-tag>
      </template>
    </el-table-column>
    <el-table-column
        prop="vipStart"
        label="会员生效时间"
        width="140"
        align="center"
    />
    <el-table-column
        prop="vipEnd"
        label="会员结束时间"
        width="140"
        align="center"
    />
    <el-table-column
        prop="coin"
        label="积分"
        width="120"
        align="center"
    />
  </el-table>
</template>

<style lang="less" scoped>

</style>